<template>
  <div class="container">
    <br />
    <br /><br />
    <div>
      <h3>新增权限信息</h3>
    </div>
    <div class="shuchu1">
      角色名称:
      <el-input
        v-model="role_name"
        placeholder="请输入内容"
        style="width: 230px"
      ></el-input>
    </div>
    <div>
      备&emsp;&emsp;注:
      <el-input
        type="textarea"
        :rows="2"
        placeholder="请输入内容"
        v-model="beizhu"
        style="width: 230px"
        class="wenbenyu"
      >
      </el-input>
    </div>
    <div class="role1">角色权限:
      <el-select v-model="value" placeholder="请选择">
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
          style="width:230px"
        >
        </el-option>
      </el-select>
    </div>
    <div class="but1">
      <el-button type="success" @click="crerole">确定</el-button>
      <el-button @click="fanhui" type="info">返回</el-button>
    </div>
  </div>
</template>

<script>
export default {
  name: "createrole",
  data() {
    return {
      role_name: "",
      biezhu: "",
      options: [{
          value: '选项1',
          label: '普通角色'
        }, {
          value: '选项2',
          label: '部门管理员'
        }, {
          value: '选项3',
          label: '最高级管理员'
        },],
        value: ''
    };
  },
  props: {},

  components: {},
  created() {},

  mounted() {},

  beforeDestroy() {},

  methods: {
    fanhui() {
      this.$router.push("/mainhome");
    },
    crerole(){
        this.axios.post('http://127.0.0.1:8000/rbac/v1/createrole/',{role_name:this.role_name,beizhu:beizhu}).then(res=>{
            if (res.data.code == 200) {
                alert('添加成功')
            }
        }).catch(err=>{
            console.log(err);
            alert('添加失败,请联系管理员: + 86 8886848')
        })
    }
  },

  computed: {},

  watch: {},

  directives: {},

  filters: {},
};
</script>

<style scoped >
.wenbenyu {
  padding-top: 5%;
}
.shuchu1 {
  padding-top: 5%;
}
.but1 {
  padding-top: 2%;
}
.role1{
    padding-top: 3%;
}
</style>
